<template>
  <div class="global-footer">
    <div class="links" v-if="links">
      <a v-for="item in links" :href="item.href" :target="!item.blankTarget ? '_self': '_blank' ">{{ item.title }}</a>
    </div>
    <div class="copyright">
      <slot name="copyright">{{ copyright }}</slot>
    </div>
  </div>
</template>
<script>
  export default {
    name: 'GlobalFooter',
    props: {
      links: {
        type: Array
      },
      copyright: {
        type: String
      }
    }
  }
</script>
<style>
.global-footer {
  padding:  5px 16px 15px;
  text-align: center;
}
.global-footer .links {
  margin-bottom: 8px;
}
.global-footer .links a {
  color: rgba(0, 0, 0, 0.45);
  -webkit-transition: all .3s;
  -o-transition: all .3s;
  transition: all .3s;
}
.global-footer .links a:not(:last-child) {
  margin-right: 40px;
}
.global-footer .links a:hover {
  color: rgba(0, 0, 0, 0.65);
}
.global-footer .copyright {
  color: rgba(0, 0, 0, 0.45);
  font-size: 14px;
}
</style>
